<%@page import="database.SupplierDAO"%>
<%@page import="model.Supplier"%>
<%@page import="model.Role"%>
<%@page import="model.Staff"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html>
<%
    Staff staff = (Staff) session.getAttribute("staff");

    if (staff == null) {
        response.sendRedirect(request.getContextPath() + "/Administration");
    } else if (!staff.getRoleList().contains(new Role(1))) {
        response.sendRedirect(request.getContextPath() + "/Administration/home");
    } else {
%>
<html>
    <style>
        .toggler { width: 500px; height: 200px; }
    </style>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Warehousing Management</title>
        <link href="<%= request.getContextPath()%>/css/style_for_page.css" rel="stylesheet" type="text/css"/>
        <link href="<%= request.getContextPath()%>/css/style_for_menu.css" rel="stylesheet" type="text/css"/>
        <link href="<%= request.getContextPath()%>/css/style_addtion.css" rel="stylesheet" type="text/css"/>
        <link href="<%= request.getContextPath()%>/css/adMenu.css" rel="stylesheet" type="text/css"/>
        <link href="<%= request.getContextPath()%>/css/tHeaderFooter.css" rel="stylesheet" type="text/css"/>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
        <link rel="stylesheet" href="/resources/demos/style.css" />
        <script>
            $(function() {
                 $("#datepicker").datepicker();
                //$("#datepicker").datepicker('setDate', 'today');
                // $("#datepicker").datepicker('setDate', 'today');
                function runEffect() {
                    // get effect type from
                    var selectedEffect = $("#effectTypes").val();
                    // most effect types need no options passed by default
                    var options = {};
                    // some effects have required parameters

//            options = { percent: 100 };

                    options = {to: {width: 280, height: 185}};
                    // run the effect
                    $("#effect").show(selectedEffect, options, 500, callback);
                }
                ;
                function callback() {
                    setTimeout(function() {
                        $("#effect:visible").removeAttr("style").fadeOut();
                    }, 1000);
                }
                ;
                
                function totalAmount1() {
                   var quan1 = $("#quan1").val();
                   var price = $("#price1").val();
                   $("#total1").val(quan1 * price);
                };
                 $("#quan1").mouseleave(function()
                {
                    totalAmount1();
                });
                 $("#total1").click(function()
                {
                    totalAmount1();
                });
                
                 function totalAmount2() {
                   var quan1 = $("#quan2").val();
                   var price = $("#price2").val();
                   $("#total2").val(quan1 * price);
                };
               
                 $("#total2").click(function()
                {
                    totalAmount2();
                });
                
                
                function totalAmount3() {
                   var quan1 = $("#quan3").val();
                   var price = $("#price3").val();
                   $("#total3").val(quan1 * price);
                };
               
                 $("#total3").click(function()
                {
                    totalAmount3();
                });
                 function totalAmount4() {
                   var quan1 = $("#quan4").val();
                   var price = $("#price4").val();
                   $("#total2").val(quan1 * price);
                };
               
                 $("#total2").click2(function()
                {
                    totalAmount2();
                });
                // set effect from select menu value
                $("#button").click(function() {
                    runEffect();
                    return false;
                });
                $("#effect").hide();
            });
        </script>
    </head>

    <% int i = 0;%>   
    <body class="container">

        <header>
            <div class="header"> 
                <%@include file="/include/mHeader.jsp" %>
            </div>
            <div class="adContent">
                <div class="adMenu">
                    <%@include file="/include/mMenu.jsp" %>
                </div>
            </div>
        </header>
        <div class="content2">
            <div class="registerbg" >
                <s:form theme="simple"  namespace="/Administration/Receipt">
                    <div class="registerFormVertical">
                        <h3 style="float:left; margin-top: 5px">New Receipting</h3>
                        <table style="margin: auto; width: 1024px; float:left;margin-top: 10px;">
                            <tr>
                                <td>
                                    <p>Select Supplier Name: <s:select theme="simple" label="Select Supplier Name "  list="allSuppliers"   name="idSupplier" cssStyle="width: 200px;"/> </p>
                                </td>
                                 <td>
                                    <p>Select Staff Name: <s:select theme="simple" label="Select Supplier Name "  list="allStaffs"   name="idStaff" cssStyle="width: 200px;"/> </p>
                                </td>
                                <td>
                                    <p>Select Date: <input  type="text" name="createDate" id="datepicker" /></p>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2"><s:actionerror /></td>
                            </tr>
                        </table>
<!--                        <a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>-->

                    </div>
                    <div class="registerTermsVertical">
                       <h3 style=" margin-top: 5px">  Detail Receipting Item</h3> 
                        <div class="datagrid" style="background-color: #ffffff;border: solid windowtext 1.0pt;">
                            <table >
                                <thead>
                                    <tr>
                                        <th>Product Name</th> 
                                        <th>Quantity</th>
                                        <th>Unit Price</th>
                                        <th>Total Amount</th>
                                    </tr>
                                </thead>  
                                <tbody style="background-color: #ffffff">                                 
                                    <tr>
                                        <td><s:select id="product1" name="receiptItemList[0].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan1"  name="receiptItemList[0].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price1"  name="receiptItemList[0].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total1"  value="" readonly="true"/></td>
                                    </tr>
                                    <tr>
                                        <td><s:select id="product2" name="receiptItemList[1].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan2"  name="receiptItemList[1].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price2"  name="receiptItemList[1].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total2"   value="" readonly="true"/></td>
                                    </tr>
                                     <tr>
                                        <td><s:select id="product3" name="receiptItemList[2].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan3"  name="receiptItemList[2].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price3"  name="receiptItemList[2].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total3"  value="" readonly="true"/></td>
                                    </tr>
                                    <tr>
                                        <td><s:select id="product4" name="receiptItemList[3].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan4"  name="receiptItemList[3].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price4"  name="receiptItemList[3].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total4"   value="" readonly="true"/></td>
                                    </tr>
                                    <tr>
                                        <td><s:select id="product5" name="receiptItemList[4].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan5"  name="receiptItemList[4].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price5"  name="receiptItemList[4].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total5"   value="" readonly="true"/></td>
                                    </tr>
                                    <tr>
                                        <td><s:select id="product6" name="receiptItemList[5].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan6" name="receiptItemList[5].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price6" name="receiptItemList[5].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total6"  value="" readonly="true"/></td>
                                    </tr>
                                     <tr>
                                        <td><s:select id="product7" name="receiptItemList[6].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan7" name="receiptItemList[6].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price7"  name="receiptItemList[6].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total7"   value="" readonly="true"/></td>
                                    </tr>
                                    <tr>
                                        <td><s:select id="product8" name="receiptItemList[7].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan8"  name="receiptItemList[7].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price8" name="receiptItemList[7].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total9"   value="" readonly="true"/></td>
                                    </tr>
                                    <tr>
                                        <td><s:select id="product9" name="receiptItemList[8].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan9"  name="receiptItemList[8].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price9"  name="receiptItemList[8].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total9"   value="" readonly="true"/></td>
                                    </tr>
                                    <tr>
                                        <td><s:select id="product10" name="receiptItemList[9].product.idProduct" label="Category" cssStyle="width: 178px" list="allProducts" /></td>
                                        <td><s:textfield id="quan10"  name="receiptItemList[9].receiptQuantity" label="Category Name" size="30" /></td>
                                        <td><s:textfield id="price10" name="receiptItemList[9].receiptPrice" label="Discription" size="30" /> </td>
                                        <td><s:textfield id="total10"   value="" readonly="true"/></td>
                                    </tr>
                                </tbody>
                            </table>       
                        </div>
                        <s:submit value="Add New Receipt"  action="create-recept" cssStyle="width: auto; float:right;" theme="simple" />
                    </div>
                </s:form>
            </div>
        </div>
        <footer>
            <div id="footer">
                <%@include file="/include/iFooter.jsp" %>
            </div>   
        </footer>

    </body>
</html>
<%
    }
%>